<template>
  <div class="home">
    <!--  地位输入框  -->
    <section class="address-search">
      <section class="search">
        <van-search v-model="value" placeholder="请输入搜索关键词"/>
      </section>
    </section>




    <!--    list-->
    <section>
      <router-link class="border-bottom" to='detail'>
        <van-card
            class="border-bottom"
            num="2"
            price="2.00"
            desc="描述信息"
            title="商品标题"
            thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        />
      </router-link>
      <router-link class="border-bottom" to='detail'>
        <van-card
            class="border-bottom"
            num="2"
            price="2.00"
            desc="描述信息"
            title="商品标题"
            thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        />
      </router-link>
      <router-link class="border-bottom" to='detail'>
        <van-card
            class="border-bottom"
            num="2"
            price="2.00"
            desc="描述信息"
            title="商品标题"
            thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        />
      </router-link>
      <router-link class="border-bottom" to='detail'>
        <van-card
            class="border-bottom"
            num="2"
            price="2.00"
            desc="描述信息"
            title="商品标题"
            thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        />
      </router-link>
      <router-link class="border-bottom" to='detail'>
        <van-card
            class="border-bottom"
            num="2"
            price="2.00"
            desc="描述信息"
            title="商品标题"
            thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        />
      </router-link>
      <router-link class="border-bottom" to='detail'>
        <van-card
            class="border-bottom"
            num="2"
            price="2.00"
            desc="描述信息"
            title="商品标题"
            thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        />
      </router-link>
      <router-link class="border-bottom" to='detail'>
        <van-card
            class="border-bottom"
            num="2"
            price="2.00"
            desc="描述信息"
            title="商品标题"
            thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        />
      </router-link>
      <router-link class="border-bottom" to='detail'>
        <van-card
            class="border-bottom"
            num="2"
            price="2.00"
            desc="描述信息"
            title="商品标题"
            thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        />
      </router-link>
      <router-link class="border-bottom" to='detail'>
        <van-card
            class="border-bottom"
            num="2"
            price="2.00"
            desc="描述信息"
            title="商品标题"
            thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        />
      </router-link>
      <router-link class="border-bottom" to='detail'>
        <van-card
            class="border-bottom"
            num="2"
            price="2.00"
            desc="描述信息"
            title="商品标题"
            thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        />
      </router-link>
      <router-link class="border-bottom" to='detail'>
        <van-card
            class="border-bottom"
            num="2"
            price="2.00"
            desc="描述信息"
            title="商品标题"
            thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        />
      </router-link>
    </section>
  </div>
</template>

<script>
import Swipe from '@/components/Swipe'

export default {
  name: 'Home',
  components: {
    Swipe
  },
  data() {
    return {
      value1: 0,
      value2: 'a',
      value: '',
      active: 0,
      option1: [
        {text: '全部商品', value: 0},
        {text: '新款商品', value: 1},
        {text: '活动商品', value: 2},
      ],
    }
  },
}
</script>

<style lang="less" scoped>
.home {
  .address-search {
    background-color: #39a9ed;
    display: flex;
    align-items: center;
    justify-content: space-around;

    .search{
      width: 100%;
      .van-search {
        width: 100%;
        background-color: #39a9ed;
      }
    }


  }
  .goods-card {
    margin: 0;
    background-color: #39a9ed;
  }

  .delete-button {
    height: 100%;
  }
}
</style>
